import React, { useState, useEffect } from 'react';
import ReactDOM from 'react-dom';
import { Line } from '@ant-design/charts';

const DemoLine = (props: any) => {
    const { data } = props;
    const config = {
        data,
        // padding: 'auto',
        xField: 'data',
        yField: 'visit_num',
        // annotations: [
        //   低于中位数颜色变化
        //   {
        //     type: 'regionFilter',
        //     start: ['min', 'median'],
        //     end: ['max', '0'],
        //     color: '#F4664A',
        //   },
        //   {
        //     type: 'text',
        //     position: ['min', 'median'],
        //     content: '中位数',
        //     offsetY: -4,
        //     style: {
        //       textBaseline: 'bottom',
        //     },
        //   },
        //   {
        //     type: 'line',
        //     start: ['min', 'median'],
        //     end: ['max', 'median'],
        //     style: {
        //       stroke: '#F4664A',
        //       lineDash: [2, 2],
        //     },
        //   },
        // ],
    };

    return <Line {...config} />;
};

export default DemoLine;
